<template>
  <PageContainer>
    <view class="container">
      <Header title="我的浏览记录" :is-box-shadow="false">
        <view style="padding: 16rpx 32rpx; height: 72rpx">
          <TSearch placeholder="请输入搜索内容" @confirm="searchFnc" />
        </view>
      </Header>

      <Paglist
        v-model="dataList"
        :is-init-api="true"
        :parame="params"
        @register="register"
        :is-show-loadmore="dataList.length > 1"
      >
        <view class="pa-16">
          <template v-for="v in dataList" :key="v.id">
            <DataItem :data="v" />
          </template>
        </view>
      </Paglist>
    </view>
  </PageContainer>
</template>

<script lang="ts" setup>
  /* myBrowseRecords 我的浏览记录 */
  import Header from '@/components/Header/index.vue';
  import PageContainer from '@/components/PageContainer/index.vue';
  import TSearch from '@/components/TSearch/index.vue';
  import Paglist from '@/components/Paglist/index.vue';
  import { useConList } from '@/components/Paglist/useConList';
  import { provide, reactive, ref } from 'vue';
  import DataItem from './components/DataItem.vue';
  import { onPageScroll, onShow } from '@dcloudio/uni-app';
  import { myBoBrowseList } from '@/api/businessOpportunities';
  import type { ISupplyDemandSquareResult } from '@/api/businessOpportunities/type';
  import type { IQuery } from '@/api/indexTypes';

  const params = reactive<IQuery & { keyWord: string }>({
    current: 1,
    size: 10,
    keyWord: '',
  });
  const dataList = ref<ISupplyDemandSquareResult[]>([]);

  provide('api', myBoBrowseList);
  const [register, { refresh }] = useConList();

  function searchFnc(keyword: string) {
    params.keyWord = keyword;
    refresh && refresh();
  }

  onShow(() => {
    if (dataList.value.length) refresh?.();
  });

  onPageScroll(() => {});
</script>

<style lang="scss" scoped>
  .add-topic {
    position: fixed;
    right: 32rpx;
    bottom: 300rpx;
    width: 104rpx;
    height: 104rpx;
    border-radius: 50%;
    background: linear-gradient(0deg, #2878ff 0%, #7bacff 100%);
    box-shadow: 0px 4rpx 24rpx 0px rgba(150, 151, 153, 0.16);
    color: #fff;
    font-size: 24rpx;
    z-index: 99;
  }
</style>
